<template>
  <div class="notice-page page">
    <nav-bar title="学习详情" theme="red" search></nav-bar>
    <div class="notice-detail-banner" v-if="flag">
      <img :src="$config.ImageURl + detailData.imageUrl" />
    </div>
    <div :class="[flag ? 'isbanner' : 'notice-detail-title']">
      {{ detailData.title }}
    </div>
    <div :class="[flag ? 'notice-detail-divisionMargin' : 'notice-detail-division']"></div>
    <div class="notice-detail-user">
      <span class="notice-detail-user-name">{{ detailData.publishPersonName }}</span>
      <span class="notice-detail-user-time">{{ detailData.publishTime }}</span>
    </div>
    <div class="act-detail-list" v-if="$route.query.learnType === '2' && detailData.type !== '4'">
      <div v-for="(item, index) in detailFields" :key="index" class="act-detail-item">
        <div class="act-detail-label-wrap">
          <div class="act-detail-label">
            <em class="act-detail-red-dot"></em>
            {{ item.label }}
          </div>
        </div>
        <div class="act-detail-text ql-editor" v-html="item.text"></div>
      </div>
    </div>
    <div v-else>
      <div class="notice-detail-content ql-editor" v-html="detailData.learnContent"></div>
      <ul v-if="detailData.files && detailData.files.length > 0" class="file-list">
        <li v-for="(item, index) in detailData.files" :key="index" class="file-item" v-down="item.fileUrl">
          {{ item.fileName }}
        </li>
      </ul>
    </div>
  </div>
</template>
<script>
import partyBuilding from '@/api/partyBuilding'
export default {
  components: {},
  data() {
    return {
      detailData: {},
      flag: false,
      detailFields: [
        {
          label: '会议时间',
          text: ''
        },
        {
          label: '会议地点',
          text: ''
        },
        {
          label: '参会人员',
          text: ''
        },
        {
          label: '参会内容',
          text: ''
        },
        {
          label: '会议要求',
          text: ''
        },
        {
          label: '其他',
          text: ''
        }
      ]
    }
  },
  created() {
    this.getDetail()
  },
  methods: {
    // 详情
    getDetail() {
      const paramsData = {
        learnType: this.$route.query.learnType,
        code: this.$route.query.code
      }
      partyBuilding.Study.detail(paramsData).then(res => {
        const { data } = res.data
        this.detailData = data
        this.flag = this.detailData.isBanner === '1'
        this.detailFields[0].text = data.sessionsTime ? data.sessionsTime : ''
        this.detailFields[1].text = data.sessionsPlace
        this.detailFields[2].text = data.sessionsPerson
        this.detailFields[3].text = data.sessionsContent
        this.detailFields[4].text = data.sessionsDemand
        this.detailFields[5].text = data.other
      })
    }
  }
}
</script>
<style lang="less" scoped>
@import '~@/assets/style/notice/detail.less';
@import '~@/assets/style/partyBuilding/Activity/detail.less';
</style>
